<template>
  <view
    class="smt-tag"
    :style="{
      color: textColor || 'rgba(252, 127, 4, 1)',
      background: backgroundColor || 'rgba(252, 127, 4, 0.1)',
    }"
  >
    <slot>
      <text>{{ text }}</text>
    </slot>
  </view>
</template>

<script>
export default {
  props: {
    text: {
      type: String,
      default: "",
    },
    textColor: {
      type: String,
      default: "",
    },
    backgroundColor: {
      type: String,
      default: "",
    },
  },
};
</script>

<style lang="scss" scoped>
.smt-tag {
  display: inline-block;
  padding: 4rpx 16rpx;
  font-size: 20rpx;
  border-radius: 4rpx;
}
</style>
